<!DOCTYPE html>
<html lang="en-US">

<head>
  <meta charset="utf-8">
  <title>JavaScript label example</title>
  <style>
    p {
      font-family: sans-serif;
      letter-spacing: 1px;
      text-transform: uppercase;
      text-align: center;
      border: 2px solid rgba(0, 0, 200, 0.6);
      background: rgba(0, 0, 200, 0.3);
      color: rgba(0, 0, 200, 0.6);
      box-shadow: 1px 1px 2px rgba(0, 0, 200, 0.4);
      border-radius: 10px;
      padding: 3px 10px;
      display: inline-block;
      cursor: pointer;
    }
  </style>
</head>

<body>
<p>玩家1：小明</p>

<script>
  var para = document.querySelector('p');
  para.addEventListener('click', updateName);

  function updateName() {
    var name = prompt('输入一个新的名字：');
    para.textContent = '玩家1：' + name;
  }
</script>
</body>

</html>
